import 'dart:ui';

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
      ),
      home: PathDemo(),
    );
  }
}

class PathDemo extends StatefulWidget {
  @override
  _PathDemoState createState() => _PathDemoState();
}

class _PathDemoState extends State<PathDemo> {
  Offset? _clickOffset;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('绘制专题')),
      body: Center(
        child: GestureDetector(
          onPanUpdate: (DragUpdateDetails details) {
            setState(() {
              _clickOffset = details.localPosition;
            });
          },
          child: Container(
            width: 500,
            height: 500,
            color: Colors.blue.shade100,
            child: CustomPaint(
              size: Size(500, 500),
              //画布
              //绘制工作
              painter: PathPainter(_clickOffset),
            ),
          ),
        ),
      ),
    );
  }
}

class PathPainter extends CustomPainter {
  final Paint _paint = Paint()
    //颜色
    ..color = Colors.red
    //填充方式
    ..style = PaintingStyle.stroke
    //拐角的样式
    ..strokeCap = StrokeCap.round
    //宽度
    ..strokeWidth = 3;
  Offset? clickOffset;
  PathPainter(this.clickOffset);
  @override
  void paint(Canvas canvas, Size size) {
    Path path = Path();

    //定一个起点
    // path.moveTo(100, 100);
    // //直线
    // path.lineTo(200, 100);
    // path.lineTo(200, 200);
    // path.close();

    path.moveTo(100, 100);

    if (clickOffset != null) {
      //曲线  二阶
      _paint.color = Colors.red;

      path.quadraticBezierTo(
        //控制点
        clickOffset!.dx,
        clickOffset!.dy,
        //终点
        200,
        100,
      );
      canvas.drawPath(path, _paint);

      _paint.color = Colors.black;
      _paint.strokeWidth = 10;
      canvas.drawPoints(PointMode.points, [
        Offset(100, 100), //起点
        Offset(clickOffset!.dx, clickOffset!.dy), //控制点
        Offset(200, 100), //终点
      ], _paint);
    }
    if (clickOffset != null) {
      canvas.drawPoints(PointMode.points, [
        Offset(50, 250), //起点
        Offset(350, 250), //终点
        Offset(100, 300), //控制1
        Offset(clickOffset!.dx, clickOffset!.dy), //控制2
      ], _paint);

      //三阶
      _paint.color = Colors.deepPurple;
      _paint.strokeWidth = 3;

      Path path2 = Path();

      path2.moveTo(50, 250);

      //三阶
      path2.cubicTo(
        //控制点1
        100,
        300,
        //控制点2
        clickOffset!.dx,
        clickOffset!.dy,
        //终点
        350,
        250,
      );

      canvas.drawPath(path2, _paint);
    }
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return true;
  }
}
